﻿@page "/Overview"
@inherits MasaComponentBase

<PageTitle>@T("Overview")</PageTitle>

<CascadingValue Value="this">
    <MTabs ValueChanged="TabValueChangedAsync" Value="_curTab" SliderColor="transparent" class="pro-nav remover-ripple">
        <MTab class="text-capitalize pa-0">
            <ChildContent>
                <span class="mtab-tab-line mtab-tab-linear-primary"></span>
                <span class="rounded-circle mtab-tab-indicator mtab-tab-indicator-primary"></span>
                <span class="mtab-tab-title">@T("Overview")</span>
            </ChildContent>
        </MTab>
        <MTab class="text-capitalize pa-0" Disabled="_teamDetailDisabled">
            <ChildContent>
                <span class="mtab-tab-line @(_curTab.ToInt32()>0?"mtab-tab-linear-primary":"mtab-tab-linear-neutral")"></span>
                <span class="rounded-circle mtab-tab-indicator @(_curTab.ToInt32()>0?"mtab-tab-indicator-primary":"mtab-tab-indicator-neutral")"></span>
                <span class="mtab-tab-title">@T("Project detail")</span>
            </ChildContent>
        </MTab>
        <MTab class="text-capitalize pa-0" Disabled="_configDisabled">
            <ChildContent>
                <span class="mtab-tab-line @(_curTab.ToInt32()>1?"mtab-tab-linear-primary":"mtab-tab-linear-neutral")"></span>
                <span class="rounded-circle mtab-tab-indicator @(_curTab.ToInt32()>1?"mtab-tab-indicator-primary":"mtab-tab-indicator-neutral")"></span>
                <span class="mtab-tab-title">@T("Config detail")</span>
            </ChildContent>
        </MTab>
    </MTabs>

    <MTabsItems Style="background-color: transparent !important;" Value="_curTab" class="pt-6">
        <MTabItem>
            <MRow>
                <MCol Cols="2">
                    <MNavigationDrawer Permanent Class="rounded-4" Style="height:calc(100vh - 192px ); width:100% !important">
                        <div class="ml-6" style="display:flex; flex-direction:column; overflow: auto; height:calc(100vh - 200px );">
                            <MList>
                                <MListItemGroup Class="rounded-2" @bind-Value="_selectedEnvId" Mandatory Color="#A3AED0">
                                    @foreach (var env in _environments)
                                    {
                                        <MTooltip Left Class="ml-1">
                                            <ActivatorContent>
                                                <MListItem @attributes="@context.Attrs" Context="_" Style="height: 48px !important; min-height: 48px !important;margin:18px 24px -32px 0px !important" Class="rounded-2 env-list" Value="env.Id" Dense OnClick="@(()=>GetClustersByEnvIdAsync(env.Id))">
                                                    <ItemContent>
                                                        <MListItemIcon Class="d-flex align-center mr-0" Style="height: 32px;">
                                                            <SIcon Color="@env.Color" Size="12">mdi-circle</SIcon>
                                                        </MListItemIcon>
                                                        <MListItemContent>
                                                            <MListItemTitle>@env.Name</MListItemTitle>
                                                        </MListItemContent>
                                                    </ItemContent>
                                                </MListItem>
                                            </ActivatorContent>
                                            <ChildContent>
                                                <span>@env.Name</span>
                                            </ChildContent>
                                        </MTooltip>
                                    }
                                </MListItemGroup>
                            </MList>
                        </div>
                    </MNavigationDrawer>
                </MCol>
                <MCol Cols="10">
                    <div style="overflow: hidden; display:block;">
                        <MRow NoGutters Align="AlignTypes.Center" Class="env-toolbar rounded-5" Style="height:96px; background:#fff;padding:0 12px;">
                            <MCard>
                                <MTabs @bind-Value="_selectEnvClusterId" Class="cluster-tabs mt-2" Style="height:52px;margin-top:-3px;" BackgroundColor="#fff" ShowArrows="@(true)" ActiveClass="cluster-tab-active" HideSlider>
                                    @foreach (var cluster in _clusters)
                                    {
                                        StringNumber envClusterId = (StringNumber)cluster.EnvironmentClusterId;
                                        <MTooltip Top>
                                            <ActivatorContent>
                                                <MTab @attributes="@context.Attrs" Style="height: 48px; max-width: 150px;" Value="envClusterId">
                                                    <div class="text-overflow">@cluster.Name</div>
                                                </MTab>
                                            </ActivatorContent>
                                            <ChildContent>
                                                <span>@cluster.Name</span>
                                            </ChildContent>
                                        </MTooltip>
                                    }
                                </MTabs>
                            </MCard>
                        </MRow>
                        <div class="mt-6" style="height:calc(100vh - 312px ); display:flex; flex-direction:column; justify-content:space-between; overflow: hidden; position: relative;">
                            <ProjectList @ref="_projectList"
                                         LandscapePage
                                         EnvironmentClusterId="_selectEnvClusterId.AsT1"
                                         OnNameClick="NavigateToAppAsync"
                                         OnAppCardClick="NavigateToConfigAsync"
                                         OnAppPinClick="AppPin" />
                        </div>
                    </div>
                </MCol>
            </MRow>
        </MTabItem>
        <MTabItem>
            <Masa.Dcc.Web.Admin.Rcl.Pages.App ProjectId="_selectProjectId" @ref="_app">
            </Masa.Dcc.Web.Admin.Rcl.Pages.App>
        </MTabItem>
        <MTabItem>
            <Config AppId="@_configModel.AppId"
                ConfigObjectType="@_configModel.ConfigObjectType"
                EnvironmentClusterId="@_configModel.EnvironmentClusterId"
                ProjectId="@_configModel.ProjectId"
                ProjectIdentity="@_configModel.ProjectIdentity"
                @ref="_config">
            </Config>
        </MTabItem>
    </MTabsItems>
</CascadingValue>